
import 'package:flutter/material.dart';
import 'package:flutter_trip/model/common_model.dart';
import 'package:flutter_trip/widget/webview.dart';

//活动入口
class SubNav extends StatelessWidget {
  final List<CommonModel> subNavList;

  const SubNav({
    Key key,
    @required this.subNavList,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(6)//四角一样时的简写
      ),
      child: Padding(
        padding: EdgeInsets.all(7),
        child: _items(context),
      ),
    );
  }
  // 获取活动列表
  _items(BuildContext context){
    if(subNavList == null) return null;
    List<Widget> items = [];
    subNavList.forEach((model){//not .map but .forEach
      items.add(_item(context,model));
    });
    //计算出第一行显示的数量
    int separate = (subNavList.length / 2 + 0.5).toInt();
    return Column(
      children: <Widget>[
        Row(//第一行
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: items.sublist(0, separate)
        ),
        Padding(//第二行
          padding: EdgeInsets.only(top: 10),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: items.sublist(separate, subNavList.length),
          ),
        )
      ],
    );
  }
  // 单个入口按钮
  Widget _item(BuildContext context,CommonModel model){
    return Expanded(//上下对齐
      flex: 1,
      child: GestureDetector(
        onTap: (){
          // 跳转H5页面
          Navigator.push(context, 
            MaterialPageRoute(builder: (context) => 
              WebView(
                url: model.url,
                statusBarColor: model.statusBarColor,
                hideAppBar: model.hideAppBar,
              )
            )
          );
        },
        child: Column(
          children: <Widget>[
            Image.network(
              model.icon,
              width: 18,
              height: 18,
            ),
            Padding(
              padding: const EdgeInsets.only(top: 3),
              child: Text(
                model.title,
                style: TextStyle(fontSize: 12),
              ),
            ),
          ],
        ),
      ),
    );
  }
}